<script setup lang="ts">
import { ref, onMounted } from 'vue'
import CustomNavbar from './components/CustomNavbar.vue'
// 导入会员Store
import { useMemberStore } from '@/stores'
import StudentView from './components/StudentView.vue'
import TeacherView from './components/TeacherView.vue'
import OrganView from './components/OrganView.vue'

// 获取会员Store实例
const memberStore = useMemberStore()
// 页面加载时执行
onMounted(async () => {
  // 判断是否登录
  if (!memberStore.profile) {
    // 未登录，跳转到登录页面
    uni.navigateTo({
      url: '/pages/login/login',
    })
    return
  }
})
const role = memberStore.profile?.role
</script>

<template>
  <view class="viewport">
    <!-- 自定义导航栏 -->
    <CustomNavbar />
    <!-- 内容容器 -->
    <view class="content-container">
      <view v-if="role == 'student'">
        <StudentView />
      </view>
      <view v-if="role == 'teacher'">
        <TeacherView />
      </view>
      <view v-if="role == 'organ'">
        <OrganView />
      </view>
    </view>
  </view>
</template>

<style lang="scss">
.viewport {
  height: 100vh;
  overflow: hidden;
}

.content-container {
  height: 100vh;
  box-sizing: border-box;
  padding-top: 150px;
}
</style>
